<template>
  <div id="app" class="skTableHeader">
    <a-row type="flex" :gutter="[16, 16]">
      <a-col>
        <a-select
          default-value=""
          v-model="dataForm.classId"
          class="class-select"
          style="width: 120px;"
          @change="getDetail(dataForm.dateType,'class')"
        >
          <a-select-option v-for="item in classList" :key="item.id" :value="item.id">
            {{ item.className }}
          </a-select-option>
        </a-select>
      </a-col>
      <a-col>
        <a-select
          default-value=""
          v-model="dataForm.studentId"
          class="class-select"
          style="width: 120px;"
          placeholder="幼儿" 
          @change="getDetail('student')"
        >
          <a-select-option v-for="item in studentList" :key="item.id" :value="item.id">
            {{ item.name }}
          </a-select-option>
        </a-select>
        <!-- <select-student v-model="dataForm.studentId" :classId="dataForm.classId" @change="getDetail()" :firstSelect="true" 
          placeholder="幼儿" style="width: 120px;"></select-student> -->
      </a-col>
      <a-col>
        <j-date placeholder="数据日期" date-format="YYYY-MM-DD" v-model="dataForm.dataDate"  style="width: 100%" />
      </a-col>
      <a-col>
        <a-button @click="getDetail('')">查找</a-button>
      </a-col>
    </a-row>
  </div>
</template>
<script>
import { skClassList, querySkSemester } from '@/api/management.js'
import SelectStudent from '@/components/skComponent/SelectStudent'
import { skStudentList } from '@/api/management.js'
export default {
  name: 'skTableHeader',
  data() {
    return {
      dataForm: {
        dataDate: '',
        dateType: 'sem',
        semesterId: '',
        classId: '',
        studentId: '',
        monthColumns:[]
      },
      defaultSemesterId: '',
      studentList: [],  //学生列表
      classList: [],    //班级列表
      SemesterList:[],   //学期列表
    }
  },
  props:["classId","semesterId"],
  components: { SelectStudent },
  filters: {},
  
  computed: {},
  
  created() {
    this.dataForm.dataDate = this.$skCommon.getDate(0)
    this.dataForm.dateType = 'sem';
    this.getClassList();
    this.getSkSemester();
  },
  
  activated() {
  },

  mounted() {
  },

  methods: {
    // 班级列表
    getClassList() {
      skClassList()
        .then(res => {
          if (res.success) {
            if(res.result.length == 0) {
              this.$message.warning('请设置班级')
              return
            }
            this.dataForm.classList = res.result
            this.classList = res.result
            this.dataForm.classId = this.classList[0].id
            this.getStudentList()
          } else {
            this.$message.warning(res.message)
          }
        })
        .catch(error => {
          console.error(error)
        })
    },
    getStudentList(){
      const params = {
        classId: this.dataForm.classId
      }
      skStudentList(params).then((res)=>{
        if(res.success){
          this.studentList = res.result
          if (res.result.length > 0) {
            this.dataForm.studentId = res.result[0].id
            this.dataForm.stuName = res.result[0].name
            console.log(this.dataForm.studentId);
            console.log(this.dataForm.stuName);
          }
          this.getDetail("student")
          this.getSkSemester();
        } else {
          this.$message.warning(res.message);
        }
      }).catch((error)=>{
        console.error(error);
      })
    },
    // 学期列表
    getSkSemester() {
      querySkSemester()
        .then(res => {
          if (res.success) {
            if(res.result.records.length == 0) {
              this.$message.warning('请设置学期')
              return
            }
            this.SemesterList = res.result.records
            this.getDefultSemesterId();
          } else {
            this.$message.warning(res.message)
          }
        })
        .catch(error => {
          console.error(error)
        })
    },
    getDetail(dateType,classType){
      console.log('dateType', dateType)
      if (dateType == "sem") {
        this.dataForm.semesterId = this.defaultSemesterId;
        this.dataForm.semesterHistoryId = "学期"
        this.dataForm.semester = this.SemesterList.find(item => item.id == this.dataForm.semesterId);
        this.dataForm.monthColumns = this.$skCommon.getMonths(this.dataForm.semester.startDate, this.dataForm.semester.endDate, 'yyyy-MM');
      }else{
        this.dataForm.semesterId = null
      }
      if (dateType == "historySem") {
        if(this.defaultSemesterId == this.dataForm.semesterHistoryId || this.dataForm.semesterHistoryId == "学期"){
          this.dataForm.semesterId = this.defaultSemesterId;
          this.dataForm.dateType = "sem";
          this.dataForm.semester = this.SemesterList.find(item => item.id == this.dataForm.semesterId);
          this.dataForm.monthColumns = this.$skCommon.getMonths(this.dataForm.semester.startDate, this.dataForm.semester.endDate, 'yyyy-MM');
        } else {
          this.dataForm.semesterId = null
          this.dataForm.dateType = "historySem";
          this.dataForm.semester = this.SemesterList.find(item => item.id == this.dataForm.semesterHistoryId);
          this.dataForm.monthColumns = this.$skCommon.getMonths(this.dataForm.semester.startDate, this.dataForm.semester.endDate, 'yyyy-MM');
        }
      }else{
        this.dataForm.dateType = dateType;
        this.dataForm.semesterHistoryId = "学期"
      }
      if(this.dataForm.classId) {
        this.dataForm.className = this.classList.find(item => item.id == this.dataForm.classId).className
      }
      if(classType == "class"){
        this.dataForm.studentId = undefined
        this.dataForm.stuName = undefined
        this.getStudentList()
      }else{
        console.log(this.dataForm);
        this.$emit("dataFrom",this.dataForm)
      }
    },
    // 获取默认学期id
    getDefultSemesterId(){
      let day = Date.parse(this.$skCommon.getDate(0));
      let Semester = this.SemesterList.filter(item=>{
        let time1 = Date.parse(item.startDate);
        let time2 = Date.parse(item.endDate);
        if (day > time1 && day < time2) {
          return item.id;
        }
      })
      this.defaultSemesterId = Semester[0].id
    },
  }
}
</script>
<style scoped lang="less">
/* @import url(); 引入css类 */
.date-box {
  text-align: center;
  cursor: pointer;
}
</style>
